<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
    <style>
    div{
        width: 100px;
        height: 100px;
    }
    </style>
<body>
    <div id='box'></div>
    <button id='btn'>点我换颜色</button>
    <script>
       var res="#";
        function colorRandom(n){
            if(n===0)
            return ;
            // b:0-15随机数
           var b=parseInt( Math.random()*16);
           //console.log(b); 
               switch(b%9){
                   case 1:b='A';
                   break;
                   case 2:b='B';
                   break;
                   case 3: b='C';
                   break;
                   case 4: b='D';
                   break;
                   case 5: b='E';
                   break;
                   case 6: b='F';
                   break;
                   defaul :console.log("随机数有误");
               }
            res=res+b+"";
            n--;
            //  console.log(b);
            colorRandom(n)
            return res;  
        }
        btn.onclick=function(){
            res="#";
            box.style.background=colorRandom(6);
        }
       
    </script>
</body>
</html>